<template>
  <div class="symResult">
    <Head></Head>
    <div class="result-container">
      <SymptomBtns></SymptomBtns>

      <div class="resultShow">
        <!-- 扁桃体肿大，给您推荐耳鼻喉科！ -->
        根据您<span>{{ symptomName }}</span
        >的症状给您推荐<span>{{ departmentName }}</span
        >!
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { useRoute } from "vue-router";
const route = useRoute();
const { departmentName, symptomName } = route.query;
</script>
<style scoped lang="scss">
@import "@/styles/mixins.scss";
.symResult {
  @include container;
  .result-container {
    .resultShow {
      width: 65vw;
      height: 15vh;
      border-radius: 16px;
      margin: 10vh auto;
      background: linear-gradient(to bottom, #92d2fb, #c2f0fd);
      font-size: 36px;
      color: #4962a3;
      line-height: 60px;

      padding: 50px 30px;
      span {
        //font-weight: 500;
        color: #000000;
        font-size: 40px;
      }
    }
  }
}
</style>
